<?php
    $registry   = Zend_Registry::getInstance();
    $constants = $registry->constants;
    $this->headLink()->appendStylesheet($this->baseUrl().'/static/css/main.css');
    $this->headLink()->appendStylesheet($this->baseUrl().'/static/css/place.css');
    $this->headScript()->appendFile("/static/js/jquery.js");
    $this->headScript()->appendFile("/static/js/jquery-ui-1.10.3.custom.js");
    $this->headScript()->appendFile("/static/js/jquery-ui-1.10.3.custom.min.js");
    $this->headScript()->appendFile("/static/js/jquery-ui-1.10.3.custom.min.js");
?>
<html>
    <head>
        <?php 
            echo $this->headLink();
            echo $this->headScript();
            ?>
        <meta charset="utf-8">
        <title>Add Comment</title>
        <link rel="shortcut icon" href="/static/images/favicon.png">
        
        
    </head>
    <body>
        <div class="wrapper">
            <div class="header">
                <div class="topbar-center">
                    <span style="color:#DF5A49;font-weight: bold">COMMENT</span>
                    <span style="color:#000">PLACE</span>
                </div>
                <div class="login-logout">
                    <span><?php echo "Xin chào ".$this->userName?></span> | <span><a href="/place/index/logout">LogOut</a></span>

                </div>
            </div>
            <div class="content">
                <div class="menu-left">
                    <ul>
                    <?php foreach($this->userFeature as $key=>$value){?>
                        <li><a href="<?php echo $value->feature_url?>"><?php echo $value->feature_name;?></a></li>
                    <?php }?>
                    </ul>
                </div>
                <div class="deal-content1">
                    <div class="content1-title" >
                    </div>
                        <div class="content1-group-input-left">
                            <div class="alert-place-add" ></div>
                             <div class="input-field-left">Tên: </div>
                             <div class="input-field-right-border"><?php echo $this->place->name; ?></div>
                             <div class="input-field-left">Địa chỉ:</div>
                             <div class="input-field-right-border"><?php echo $this->place->address; ?></div>
                             <div class="input-field-left">Điện thoại:</div>
                             <div class="input-field-right-border"><?php echo $this->place->phone; ?></div>
                             <div class="input-field-left">Email:</div>
                             <div class="input-field-right-border"><?php echo $this->place->mail; ?></div>
                             <div class="input-field-left">Website:</div>
                             <div class="input-field-right-border"><?php echo $this->place->website; ?></div>
                             <div style="width:100%;display:block; float: left">
                                <div class="input-field-left">Mô tả:</div>
                                <textarea class="input-field-right-area2" disabled="true"  name="description" ><?php echo $this->place->description;?></textarea>
                             </div>
                             <div class="input-field-left">Sản phẩm, dịch vụ:</div>
                             <div class="input-field-right-border"><?php echo $this->place->product_service; ?></div>
                             <div style="width:100%;display:block; float: left">
                                <div class="input-field-left">Tag:</div>
                                <textarea class="input-field-right-area2" maxlength="1000" disabled="true"><?php echo $this->place->tag;?></textarea>
                             </div>
                             <form enctype="multipart/form-data" id="myform" style="margin-top: 310px;">
                                 <div class="alert-place-add" id="alert"></div>
                                 <input type="hidden" id="place_id" name="place_id" value="<?php echo $this->place->place_id;?>" style="text-decoration: none" />
                                 <div class="input-field-left" style="color: #4395A6;">User_id(*):</div>
                                 <input value="" maxlength="255" type="text" id="user_id" name="user_id"  placeholder="user_id" class="input-field-right" />
                                 <div class="input-field-left" style="color: #4395A6;">UserName:</div>
                                 <div class="input-field-right-border" id="user_name" name="user_name"></div>
                                 <div class="input-field-left" style="color: #4395A6;" >Rate(*)</div>
                                 <select class="input-field-right" id="place_rate" name="rate">
                                    <?php foreach ($this->rateArr as $key => $value) {?>
                                        <?php if($value == 3){?>
                                            <option selected="true" value="<?php echo $value?>"><?php echo $value." sao";?></option>
                                        <?php } else{ ?>
                                            <option value="<?php echo $value?>"><?php echo $value." sao";?></option>    
                                        <?php }?>
                                        
                                    <?php }?>
                                 </select>
                                 <div class="input-field-left" style="color: #4395A6;">Ngày comment:</div>
                                 <input value="" maxlength="255" type="text" id="comment_date" name="comment_date"  placeholder="Comment Date" class="input-field-right" />
                                 <div style="width:100%;display:block; float: left">
                                    <div class="input-field-left" style="color: #4395A6;">Comment(*)</div>
                                    <textarea class="input-field-comment" id="place_comment" name="place_comment" maxlength="3000"></textarea>
                                 </div>
                             </form>
                         </div>
                        
                         <div class="content1-group-input-right">
                             <div class="alert-place-add" ></div>
                             <div id="map_canvas" class="map-canvas">
                             </div>
                         </div>
                    
                    <div class="button-add">
                        <button class="button-test" onclick="addComment('/place/place-comment/add-comment')">
                            Add New
                        </button>
                        <button class="button-test" onclick="clearContent()">
                            Clear
                        </button>
                        <button class="button-test" onclick="history.back();">
                            Back
                        </button>
                        <button class="button-test" onclick="editPlace()">
                            Edit Place
                        </button>
                    </div>
                </div>
                <div class="deal-content2">
                    <div class="table-alt" id="table-place-comment">
                    </div>
                </div>
            </div>
            
        </div>

    </body>
</html>
<script src="/static/date-picker/datetimepicker_css.js"></script>
<script>
    
    $(document).ready(function(){
        $("#user_id").focus();
        url = '/place/place-comment/load-place-comment' + "?page="+1+"&place_id=<?php echo $this->placeId ?>";
        $("#table-place-comment").load(url);
    });
    
    $(function() {
        $("#comment_date").datepicker({
            dateFormat : "dd-mm-yy"
        });
    });
    
    function editPlace(){
        window.location.replace("/place/place-edit/index?place_id="+<?php echo $this->placeId ?>);
    }
    
    $(function() {
        $("#user_id").focusout(function(){
            user_id = $('#user_id').val();
            $.ajax({
                    url : '/place/place-comment/is-user-existed?user_id='+user_id,
                    type : 'GET',
                    success : function(res) {
                        if(res == '<?php echo $constants->ALERT_USER_NOT_EXIST; ?>' ||
                            res == '<?php echo $constants->ERROR_STRING; ?>'){
                            $("#alert").text(res);
                            $("#user_name").text("");
                        }else{
                            $("#user_name").text(res);
                            $("#alert").text("");
                            $("#alert").val("");
                        }
                    },
                    cache : false,
                    contentType : false,
                    processData : false
                });
        });
        
    });
    
    
    function clearContent(){
        $("#place_comment").val("");
        $("#user_id").focus();
        
    }
    
    function addComment(url){
        place_id = $.trim($("#place_id").val());
        user_id = $.trim($("#user_id").val());
        comment = $.trim($("#place_comment").val());
        if(place_id === '' || 
            user_id == '' ||
            comment == ''){
            $("#user_id").focus();
            $("#user_id").select();
            $("#alert").text('<?php echo $constants->MISSING_PARAMETER;?>');
        }else {
            var form = new FormData($('#myform')[0]);
            $.ajax({
                url : url,
                type : 'POST',
                data : form,
                success : function(res) {
                    if(res == "<?php echo $constants->ADD_COMMENT_SUCCESS?>"){
                         $("#user_id").focus();
                         $("#user_id").val("");
                         $("#place_comment").val("");
                         $("#comment_date").val("");
                    }else{
                         $("#user_id").focus();
                         $("#user_id").select();
                    }
                    $('#alert').html(res);
                    url = '/place/place-comment/load-place-comment' + "?page="+1+"&place_id=<?php echo $this->placeId ?>";
                    $("#table-place-comment").load(url);
                },
                cache : false,
                contentType : false,
                processData : false
            });
        }
    }    
    
</script>

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
    function initialize() {
        var map_canvas = document.getElementById('map_canvas');
        var myLatlng = new google.maps.LatLng(<?php echo $this->place->latitude;?>, <?php echo $this->place->longitude;?>);
        var map_options = {
          center: myLatlng,
          zoom: 16,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        
        var map = new google.maps.Map(map_canvas, map_options);
        
        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            title: 'Hello World!'
        });
    }
    google.maps.event.addDomListener(window, 'load', initialize);
    
   
</script>